import * as React from 'react';
import {
  Breadcrumb,
  Button,
  Form,
  Input,
  message,
  Modal,
  Select,
  Spin,
  Table,
  DatePicker,
  TimePicker,
} from 'antd';
import request from '@/http';
import constant from '@/constant';
import AutoSelect from '@/components/autoSelect';
import { Link } from 'umi';
import moment from 'moment';
import All_style from '../../index.less';

const { Option } = Select;
const {RangePicker} = DatePicker
const layout = {
  labelCol: { span: 4 },
  wrapperCol: { span: 16 },
};
const course = (props: any) => {
  const [dataSource, setDataSource] = React.useState<any>();
  const [pagination, setPagination] = React.useState({
    current: 1,
    total: 1,
    pageSize: 10,
    showSizeChanger: true,
    pageSizeOptions: ['10', '50', '200', '500'],
  });

  const [formObjectForEdit] = Form.useForm(); //获取表单数据
  const [formObject] = Form.useForm()
  const [modalEditor, setModalEditor] = React.useState<any>({
    isModalVisible: false,
    id: null,
  });
  //显示
  const loadDataSource = async (
    queryParams: any,
    pageValue: any,
    pageSizeValue: any,
  ) => {
    try {
      const datas = await formObject.validateFields();
      const result: any = await request.post('/course/selectCourse', {
        ...queryParams,
        page: pageValue,
        number: pageSizeValue,
        ...datas,
        projectEndDate: datas?.vacationSubmitDate
          ? datas?.vacationSubmitDate[1]?.format('YYYY-MM-DD HH:mm:ss')
          : '',
        projectStartDate: datas?.vacationSubmitDate
          ? datas?.vacationSubmitDate[0]?.format('YYYY-MM-DD HH:mm:ss')
          : '',

      });
      if (result.code == '200') {
        const newdata = result.date.returnDate.map((d: any, index: any) => {
          return {
            classRome: d.classRome,
            courseId: d.courseId,
            courseName: d.courseName,
            courseProjectInfoId: d.courseProjectInfoId,
            projectDate: d.projectDate,
            remark: d.remark,
            responsibleTeacherId: d.responsibleTeacherId,
            responsibleTeacherName: d.responsibleTeacherName,
            signInTime: d.signInTime,
            signOutTime: d.signOutTime,
            teacherIds: d.teacherIds,
            teacherNames: d.teacherNames,
            key: `key_${index}`,
            listId: d.teacherId,
          }
        });
        setPagination({
          ...pagination,
          current: pageValue,
          pageSize: pageSizeValue,
          total: result.totalCount,
        })
        setDataSource(newdata);
      }else{
        message.error(result.message)
      }
    } catch (e) {
      message.error(e.message);
    }
  };

  React.useEffect(() => {
    loadDataSource(null, 1, pagination.pageSize).finally();
    getCourseName();
    getTrTeacherName();
    getReTeacherName();
  }, []);

  React.useEffect(() => {
    if (modalEditor.isModalVisible) {
      formObjectForEdit.setFieldsValue(modalEditor);
    }
  }, [modalEditor]);

  const pageOnChange = (page: any) => {
    loadDataSource(
      formObject.getFieldsValue(),
      page.current,
      page.pageSize,
    ).finally();
  };
  //查询实训老师
  const queryTeacherDataSource = async (): Promise<any[]> => {
    return request.get('/common/getTeacher').then((result: any) => {
      console.log(result);
      if(result.code == '200'){
        return result.date.map((item: any) => {
          return {
            label: item.format,
            value: item.id,
          };
        });
      }else{
        message.error(result.message)
      }
      
    });
  };

  //查询下拉框
  const queryProjectDataSource = async (): Promise<any[]> => {
    return request
      .post('/common/getCourse', {
        isGraduation: 1,
        roleType:1
      })
      .then((result: any) => {
        console.log(result);
        if(result.code == '200'){
          return result.date.map((item: any) => {
            return {
              label: item.format,
              value: item.id,
            };
          });
        }else{
          message.error(result.message)
        }
        
      });
  };

  //编辑课程
  //弹框（编辑）
  const [visible1, setVisible1] = React.useState<any>();
  const [changeCourse] = Form.useForm();
  const [change, setChange] = React.useState<any>()
  const showModal1 = (row: any) => {
    setChange(row.courseProjectInfoId)
    changeCourse.setFieldsValue({
      classRome: row.classRome,
      courseId: row.courseId,
      courseName:row.courseName,
      courseProjectInfoId: row.courseProjectInfoId,
      projectDate: moment(row?.projectDate),
      remark: row.remark,
      responsibleTeacherId: row.responsibleTeacherId,
      responsibleTeacherName: { value: row.responsibleTeacherId, label: row.responsibleTeacherName },
      signInTime: moment(row?.signInTime, 'HH:mm:ss'),
      signOutTime: moment(row?.signOutTime, 'HH:mm:ss'),
      teacherId: row.listId.map((item: any) => { return item.name }),
      teacherIds: row.teacherIds,
      teacherNames: { value: row.teacherIds, label: row.teacherNames }
    })
    
    formObjectForEdit.setFieldsValue({
      classRome: row.classRome,
      courseId: row.courseId,
      courseName:row.courseName,
      courseProjectInfoId: row.courseProjectInfoId,
      projectDate: moment(row?.projectDate),
      remark: row.remark,
      // responsibleTeacherId: row.responsibleTeacherId,
      responsibleTeacherId: { value: row.responsibleTeacherId, label: row.responsibleTeacherName },
      signInTime: moment(row?.signInTime, 'HH:mm:ss'),
      signOutTime: moment(row?.signOutTime, 'HH:mm:ss'),
      // teacherId: row.listId.map((item: any) => { return item.name }),
      teacherIds: row.teacherIds,
      teacherId: { value: row.teacherIds, label: row.teacherNames }
    })
    setVisible1(true);
    queryTeacherDataSource();
    queryProjectDataSource();
  };
  const modelOnOk1 = async () => {
    const datas = await changeCourse.validateFields();
    let idList = [];
      console.log(datas.teacherNames[0])
      if(datas.teacherNames[1]){
        const ids = datas.teacherNames.map((item: any) => { return { id: item.value } })
        console.log(ids)
        for (let i of ids) {
          idList.push(i.id)
        }
      }else{
        idList.push(datas.teacherNames.value)
      }
    const result: any = await request.post('/course/admin/updateCourse', {
      classRome: datas.classRome,
      courseName: datas.courseName,
      courseProjectInfoId:change,
      projectDate: datas.projectDate.format('YYYY-MM-DD'),
      remark: datas.remark,
      responsibleTeacherId: datas.responsibleTeacherName.value,
      signInTime: datas?.signInTime.format('HH:mm'),
      signOutTime: datas?.signOutTime.format('HH:mm'),
      teacherId: idList
    });
    if (result.code == '200') {
      message.success(result.message);
      loadDataSource(null, 1, pagination.pageSize).finally();
    } else {
      message.error(result.message); //弹出错误信息
      loadDataSource(null, 1, pagination.pageSize).finally();
    }
    setVisible1(false);
  };
  const modelOnCancel1 = () => {
    setVisible1(false);
  };

   //查询
   const [data, setData] = React.useState();
   const [captchaUrl, setCaptchaUrl] = React.useState('');
   //项目名称下拉框绑定接口
   const [courseName, setCourseName] = React.useState([]);
   const getCourseName = async () => {
     const CourseName: any = await request.post('/common/getCourse', {
       isGraduation: 1,
     });
     if(CourseName.code == '200'){
        setCourseName(CourseName.date);
     }else{
      message.error(CourseName.message)
     }
     
   };
   // 实训老师下拉框接口绑定
   const [trTeacherName, setTrTeacherName] = React.useState([]);
   const getTrTeacherName = async () => {
     const TrTeacherName: any = await request.get('/common/getTrainingTeacher');
     console.log(TrTeacherName);
     if(TrTeacherName.code == '200'){
        setTrTeacherName(TrTeacherName.date);
     }else{
      message.error(TrTeacherName.message)
     }   
   };
   // 责任老师下拉框接口绑定
   const [reTeacherName, setReTeacherName] = React.useState([]);
   const getReTeacherName = async () => {
     const ReTeacherName: any = await request.get(
       '/common/getResponsibleTeacher',
     );
     if(ReTeacherName.code == '200'){
      setReTeacherName(ReTeacherName.date);
     }else{
      message.error(ReTeacherName.message)
     }
     
   };
 
   //重置按钮
   const onReset = () => {
     formObject.resetFields();
     loadDataSource(null, 1, pagination.pageSize);
   };

   //新增
   const modelOnOk = async () => {
    const data = await formObjectForEdit.validateFields();
      //把时间格式转换
      const dateString = data.projectDate.format('YYYY-MM-DD'); 
      const startDateTimeString = data.signInTime.format('HH:mm');
      const endDateTimeString = data.signOutTime.format('HH:mm');
      let idList = [];
      let ids;
      if(data.teacherId[1]){
        ids = data.teacherId.map((item: any) => {
          return { id: item.value };
        });
        for (let i of ids) {
          idList.push(i.id);
        }
      }else{
        return { id: data.teacherId[0].value };
      }
      
      
      const result: any = await request.post(
        '/course/admin/addCourse',
        {
          id: modalEditor.id,
          ...data,
          courseName: data.courseName,
          projectDate: dateString,
          responsibleTeacherId: data.responsibleTeacherId.value,
          signInTime: startDateTimeString,
          signOutTime: endDateTimeString,
          teacherId: idList,
        },
      );
      if (result.code == '200') {
        message.success(result.message);
        initModalEditor(false, null);
        pageOnChange({
          ...pagination,
        });
      }else{
        message.error(result.message)
      }
    loadDataSource(null, 1, pagination.pageSize).finally();
  };
  const initModalEditor = (isModalVisible: any, row: any) => {
    queryTeacherDataSource();
    let id = null;
    if (row) {
      setModalEditor({
        isModalVisible: isModalVisible,
        id: row.id,
        name: row.name,
        projectId: { value: row.projectId, label: row.projectName },
        instructorTeacherId: {
          value: row.instructorTeacherId,
          label: row.instructorTeacherName,
        },
        trainingTeacherTeacherId: row.trainingTeacherList.map((item: any) => {
          return { value: item.id, label: item.name };
        }),
        description: row.description,
        trainingTeacherTeacherId2: row.trainingTeacherList.map((item: any) => {
          return { value: item.id, label: item.name };
        }),
      });
    } else {
      setModalEditor({
        isModalVisible: isModalVisible,
        id: null,
        name: '',
        projectId: undefined,
        instructorTeacherId: undefined,
        trainingTeacherTeacherId: undefined,
        description: '',
      });
    }
  };

  const modelOnCancel = () => {
    initModalEditor(false, null);
  };

  /**
   * 删除数据
   * @param id
   */
  const deleteOnClick = async (courseProjectInfoId: any) => {
    const result: any = await request.post(
      '/course/admin/deleteCourse', {
        courseProjectInfoId:courseProjectInfoId
      }
    );
    if (result.code === '200') {
      message.success('数据删除成功');
      loadDataSource(
        formObject.getFieldsValue(),
        pagination.current,
        pagination.pageSize,
      ).finally();
    }else{
      message.error(result.message)
    }
  };

  /**
   * 选择学生
   */
   const [visible2, setVisible2] = React.useState<any>();
   const [selectStudent] = Form.useForm(); //获取编辑教师的表单对象
   const showModal2 = (row: any) => {
    teamName()
    setChange(row.courseProjectInfoId)
    setVisible2(true);
    
  };
  const modelOnOk2 = async () => {
    const datas = await selectStudent.validateFields();
    let idList = [];
      console.log(datas.studentId)
      if(datas.studentId){
        if(datas.studentId[1]){
          const ids = datas.studentId.map((item: any) => { return { id: item.value } })
          console.log(ids)
          for (let i of ids) {
            idList.push(i.id)
          }
        }else{
          idList.push(datas.studentId[0].value)
        }
      }
      console.log(idList)
    const result: any = await request.post('/course/admin/chooseCourseStudent', {
      courseProjectInfoId:change,
      teamId: teamIdList,
      studentId:idList
    });
    if (result.code == '200') {
      message.success(result.message);
      loadDataSource(null, 1, pagination.pageSize).finally();
    } else {
      message.error(result.message); //弹出错误信息
      loadDataSource(null, 1, pagination.pageSize).finally();
    }
    setVisible2(false);
  };
  const modelOnCancel2 = () => {
    setVisible2(false);
  };
  //查询小组下拉框
   const teamName = async (): Promise<any[]> => {
    return request
      .post('/team/selectTeam', {
        isGraduation: 1,
        page: 1,
        number: 10,
      })
      .then((result: any) => {
        if(result.code == '200'){
          return result.date.returnDate.map((item: any) => {
            return {
              label: item.teamName,
              value: item.teamInfoId,
            };
          });
        }else{
          message.error(result.message)
        }
        
      });
  };

  const [teamIdList,setTeamIdList] = React.useState([])
  let idList:any = []
  let idsList:any = []
  const TeamId = async () => {
    const datas = await selectStudent.validateFields();   
    if(datas.teamId[1]){
      const ids = datas.teamId.map((item: any) => { return { id: item.value } })
      for (let i of ids) {
        idsList.push(i.id)
      }
    }else{
      idsList.push(datas.teamId[0].value)
    }

    //数组去重
    for (var i = 0; i < idsList.length; i++) {
      if (idsList.indexOf(idsList[i]) === i) {
        idList.push(idsList[i])
      }
    }
    console.log(idList)
    setTeamIdList(idList)
    
  }
  // 查询学生下拉框
  const studentName = async (): Promise<any[]> => {
    return request
      .post('/common/selectTeamStudents', {
        teamInfoId:teamIdList
      })
      .then((result: any) => {
        console.log(result);
        if(result.code == '200'){
          return result.date.map((item: any) => {
            return {
              label: item.format,
              value: item.id,
            };
          });
        }else{
          message.error(result.message)
        }
        
      });
  };

  return (
    <div className={All_style.box}>
      <Form layout="inline" form={formObject} preserve={false}>
        <div style={{ clear: 'both' }}>
          <Form.Item
            name="vacationSubmitDate"
            label="日期："
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <RangePicker showTime className={All_style.select} />
          </Form.Item>

          <Form.Item
            name="courseName"
            label="项目名称："
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <Select defaultValue="请选择" className={All_style.select}>
              {courseName.map((c: any, index: any) => {
                return (
                  <Option key={`k_${index}`} value={c.format}>
                    {c.format}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>

          <Form.Item
            name="teacherId"
            label="实训老师："
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <Select defaultValue="请选择" className={All_style.select}>
              {trTeacherName.map((c: any, index: any) => {
                return (
                  <Option key={`k_${index}`} value={c.id}>
                    {c.format}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>
        </div>

          <Form.Item
            name="responsibleTeacherId"
            label="责任老师："
            style={{ float: 'left' }}
            className={All_style.formItem}
          >
            <Select defaultValue="请选择" className={All_style.select}>
              {reTeacherName.map((c: any, index: any) => {
                return (
                  <Option key={`k_${index}`} value={c.id}>
                    {c.format}
                  </Option>
                );
              })}
            </Select>
          </Form.Item>

          <div style={{ clear: 'both'}}>
          <Button
            className={All_style.button}
            type="primary"
            onClick={() => {
              loadDataSource(null, 1, pagination.pageSize);
            }}
          >
            查询
          </Button>
          <Button className={All_style.button2} onClick={onReset}>
            重置
          </Button>
        </div>
      </Form>

      <Button
        style={{ marginBottom: '10px' }}
        type="primary"
        onClick={() => {
          initModalEditor(true, null);
        }}
      >
        新增
      </Button>
      {/* <Spin spinning={false}> */}
        <Table
          // scroll={{ x: 1200 }}
          columns={[
            {
              title: '日期',
              dataIndex: 'projectDate',
              key: 'projectDate',
              width: 80,
              align: 'center',
            },
            {
              title: '项目名称',
              dataIndex: 'courseName',
              key: 'courseName',
              width: 100,
            },
            {
              title: '实训老师',
              dataIndex: 'teacherId',
              key: 'teacherId',
              width: 180,
              align: 'center',
              render: (text, row) => {
                return (
                  <>
                    {row?.listId?.map((item: any, index: number) => {
                      return (
                        <span key={index}>
                          {item.name}
                          <br />{' '}
                        </span>
                      );
                    })}
                  </>
                );
              },
            },
            {
              title: '责任老师',
              dataIndex: 'responsibleTeacherName',
              key: 'responsibleTeacherName',
              width: 100,
              align: 'center',
            },
            {
              title: '签到时间',
              dataIndex: 'signInTime',
              key: 'signInTime',
              width: 100,
              align: 'center',
            },
            {
              title: '签退时间',
              dataIndex: 'signOutTime',
              key: 'signOutTime',
              width: 100,
            },
            {
              title: '教室',
              dataIndex: 'classRome',
              key: 'classRome',
              width: 100,
            },
            {
              title: '备注',
              dataIndex: 'remark',
              key: 'remark',
              width: 100,
            },
            {
              title: '操作',
              key: 'action',
              align: 'center',
              fixed: 'right',
              width: 180,
              render: (row: any) => (
                <div className="tableAction">
                  <Button
                    type="link"
                    onClick={() => {
                      showModal1(row);
                    }}
                  >
                    编辑
                  </Button>
                  <Button
                    type="link"
                    onClick={() => {
                      if (confirm('确认要删除？')) {
                        deleteOnClick(row.courseProjectInfoId);
                      }
                    }}
                  >
                    删除
                  </Button>
                  <Button
                    type="link"
                    onClick={() => {
                      showModal1(row);
                    }}
                  >
                    复制
                  </Button>
                    <Button type="link"
                      onClick={() => {
                        showModal2(row);
                      }}
                    >选择学生</Button>

                </div>
              ),
            },
          ]}
          dataSource={dataSource}
          pagination={pagination}
          onChange={pageOnChange}
          tableLayout="fixed"
          bordered
        />
      {/* </Spin>   */}
      {/* 选择学生  */}
      <Modal
        width={1000}
        title='选择学生'
        maskClosable={false}
        visible={visible2}
        onOk={modelOnOk2}
        destroyOnClose
        onCancel={modelOnCancel2}
        okText="确认"
        cancelText="取消"
      >
        <Form
          name="selectStudent"
          form={selectStudent}
          preserve={false}
        >
          <Form.Item
              name="teamId"
              label="选择分组"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <AutoSelect
                mode={'multiple'}
                placeholder={'选择分组'}
                fetchOptions={teamName}
                onClick={studentName}
                onChange={TeamId}
              />
          </Form.Item>

          <Form.Item
              name="studentId"
              label="选择学生"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <AutoSelect
                mode={'multiple'}
                placeholder={'选择学生'}
                fetchOptions={studentName}
              />
            </Form.Item>
        </Form>
      </Modal>

        {/* 新增课程 */} 
      <Modal
        width={1000}
        title={modalEditor.id ? '编辑' : '新增'}
        visible={modalEditor.isModalVisible}
        onCancel={modelOnCancel}
        onOk={modelOnOk}
        maskClosable={false}
        destroyOnClose
        okText="确认"
        cancelText="取消"
      >
        <Form
          {...layout}
          name="editForm"
          form={formObjectForEdit}
          preserve={false}
        >
          <Form.Item
            label="课程项目名称"
            name="courseName"
            rules={[
              {
                required: true,
                whitespace: true,
                message: '课程名称不能为空!',
              },
              { max: 30, message: '最大长度不能超过30!' },
            ]}
          >
            <Input placeholder="请输入课程名称..." />
          </Form.Item>
          <Form.Item
            label="教室"
            name="classRome"
            rules={[
              {
                required: true,
                whitespace: true,
                message: '教室不能为空!',
              },
              { max: 30, message: '最大长度不能超过30!' },
            ]}
          >
            <Input placeholder="请输入教室..." />
          </Form.Item>
          <Form.Item
            label="日期"
            name="projectDate"
            rules={[
              {
                required: true,
                message: '日期不能为空!',
              },
            ]}
          >
            <DatePicker format="YYYY-MM-DD" />
          </Form.Item>
          <Form.Item
            label="实训老师"
            name="teacherId"
            rules={[{ required: true, message: '实训老师不能为空!' }]}
          >
            <AutoSelect
              mode={'multiple'}
              placeholder={'请输入实训老师...'}
              fetchOptions={queryTeacherDataSource}
            />
          </Form.Item>
          <Form.Item
            label="责任老师"
            name="responsibleTeacherId"
            rules={[{ required: true, message: '责任老师不能为空!' }]}
          >
            <AutoSelect
              placeholder={'请输入责任老师...'}
              fetchOptions={queryTeacherDataSource}
            />
          </Form.Item>
          <Form.Item
            label="签到时间"
            name="signInTime"
            rules={[
              {
                required: true,
                message: '签到时间不能为空!',
              },
            ]}
          >
            <TimePicker format="HH:mm:ss" />
          </Form.Item>
          <Form.Item
            label="签退时间"
            name="signOutTime"
            rules={[
              {
                required: true,
                message: '签退时间不能为空!',
              },
            ]}
          >
            <TimePicker format="HH:mm:ss" />
          </Form.Item>
          <Form.Item
            label="备注"
            name="remark"
            rules={[{ max: 30, message: '最大长度不能超过30!' }]}
          >
            <Input placeholder="请输入备注..." />
          </Form.Item>
        </Form>
      </Modal>

      {/* 编辑 */}
      <Modal
        title="编辑"
        width={1250}
        maskClosable={false}
        visible={visible1}
        onOk={modelOnOk1}
        destroyOnClose
        onCancel={modelOnCancel1}
        okText="确认"
        cancelText="取消"
      >
        <Form
          name="changeForm"
          form={changeCourse}
          preserve={false}
        >
          <div style={{ clear: 'both' }}>
            <Form.Item
              name="projectDate"
              label="日&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;期"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <DatePicker format="YYYY-MM-DD" />
            </Form.Item>
            <Form.Item
              name="courseName"
              label="项目名称"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input
                placeholder={'请输入项目名称...'}
              ></Input>
            </Form.Item>

            <Form.Item
              name="teacherNames"
              label="实训老师"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <AutoSelect
                mode={'multiple'}
                placeholder={'请输入实训老师...'}
                fetchOptions={queryTeacherDataSource}

              />
            </Form.Item>
          </div>

          <div style={{ clear: 'both' }}>
            <Form.Item
              name="responsibleTeacherName"
              label="责任老师"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}

            >
              <AutoSelect
                placeholder={'请输入责任老师...'}
                fetchOptions={queryTeacherDataSource}
              />
            </Form.Item>
            <Form.Item
              name="signInTime"
              label="签到时间"
              className={All_style.formItem}
              rules={[
                { required: true, message: '请选择签到时间!' }
              ]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <TimePicker />
            </Form.Item>
            <Form.Item
              name="signOutTime"
              label="签退时间"
              className={All_style.formItem}
              rules={[{ required: true, message: '请选择签退时间!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <TimePicker />
            </Form.Item>
            <Form.Item
              name="classRome"
              label="教&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;室"
              className={All_style.formItem}
              rules={[{ required: true, message: '请输入教室!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input placeholder="请输入教室..." />
            </Form.Item>
            <Form.Item
              name="remark"
              label="备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注"
              className={All_style.formItem}
              rules={[{ max: 30, message: '最大长度不能超过30!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input placeholder="请输入备注..." />
            </Form.Item>
          </div>
          <div style={{ clear: 'both' }}></div>
        </Form>
      </Modal>
      {/* 复制 */}
      <Modal
        title="编辑"
        width={1250}
        maskClosable={false}
        visible={visible1}
        onOk={modelOnOk}
        destroyOnClose
        onCancel={modelOnCancel1}
        okText="确认"
        cancelText="取消"
      >
        <Form
          name="formObjectForEdit"
          form={formObjectForEdit}
          preserve={false}
        >
          <div style={{ clear: 'both' }}>
            <Form.Item
              name="projectDate"
              label="日&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;期"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <DatePicker format="YYYY-MM-DD" />
            </Form.Item>
            <Form.Item
              name="courseName"
              label="项目名称"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input
                placeholder={'请输入项目名称...'}
              ></Input>
            </Form.Item>

            <Form.Item
              name="teacherId"
              label="实训老师"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <AutoSelect
                mode={'multiple'}
                placeholder={'请输入实训老师...'}
                fetchOptions={queryTeacherDataSource}

              />
            </Form.Item>
          </div>

          <div style={{ clear: 'both' }}>
            <Form.Item
              name="responsibleTeacherId"
              label="责任老师"
              className={All_style.formItem}
              style={{ float: 'left', marginLeft: 30 }}

            >
              <AutoSelect
                placeholder={'请输入责任老师...'}
                fetchOptions={queryTeacherDataSource}
              />
            </Form.Item>
            <Form.Item
              name="signInTime"
              label="签到时间"
              className={All_style.formItem}
              rules={[
                { required: true, message: '请选择签到时间!' }
              ]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <TimePicker />
            </Form.Item>
            <Form.Item
              name="signOutTime"
              label="签退时间"
              className={All_style.formItem}
              rules={[{ required: true, message: '请选择签退时间!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <TimePicker />
            </Form.Item>
            <Form.Item
              name="classRome"
              label="教&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;室"
              className={All_style.formItem}
              rules={[{ required: true, message: '请输入教室!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input placeholder="请输入教室..." />
            </Form.Item>
            <Form.Item
              name="remark"
              label="备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注"
              className={All_style.formItem}
              rules={[{ max: 30, message: '最大长度不能超过30!' }]}
              style={{ float: 'left', marginLeft: 30 }}
            >
              <Input placeholder="请输入备注..." />
            </Form.Item>
          </div>
          <div style={{ clear: 'both' }}></div>
        </Form>
      </Modal>
    </div>
  );
};
export default course;
